Home:ALL Converter>JsQRScanner in Angular5 Not Working

JsQRScanner in Angular5 Not Working

Ask Time:2018-01-23T13:52:24         Author:Pitiwat Rakprommarat

Json Formatter

JsQRScanner in Angular5 Not Working. I'm not sure I do right?

https://github.com/jbialobr/JsQRScanner

or Who knows how to do it?

in angular-cli.json

.js

 "scripts": [
    "jsqrscanner.nocache.js"
  ],

.css

"styles": [
    "styles.css",
    "assets/css/JsQRScanner.css"
  ],

in scanner.component.ts

declare var JsQRScanner:any;

all scanner.component.ts

import { Component, OnInit,ViewChild,ElementRef } from '@angular/core';

declare var JsQRScanner:any;

@Component({
 selector: 'app-scanner',
 templateUrl: './scanner.component.html',
 styleUrls: ['./scanner.component.css']
 })
 export class ScannerComponent implements OnInit {

 @ViewChild('scanner')scanner:ElementRef;
 @ViewChild('scannedTextMemo')scannedTextMemo:ElementRef;
 @ViewChild('scannedTextMemoHist')scannedTextMemoHist:ElementRef;

 scannerView=this.scanner.nativeElement;
 scannedTextMemoView=this.scannedTextMemo.nativeElement;
 scannedTextMemoHistView=this.scannedTextMemoHist.nativeElement;

 constructor() { 
 //this. JsQRScannerReady();
 }

 onQRCodeScanned(scannedText)
 {
 var scannedTextMemo = this.scannedTextMemoView//////////
  if(scannedTextMemo)
  {
   scannedTextMemo.innerHTML = scannedText;
  }
 var scannedTextMemoHist =this.scannedTextMemoHistView; /////////////
 if(scannedTextMemoHist)
 {
  scannedTextMemoHist.value = scannedTextMemoHist.value + '\n' + scannedText;
 }
 }

 ngOnInit() {

 }

 ngAfterViewInit() {
   var jbScanner = new JsQRScanner(this.onQRCodeScanned);

   jbScanner.setSnapImageMaxSize(300);
   var scannerParentElement =this.scannerView; /////////////////////

   if(scannerParentElement)
   {

     jbScanner.appendTo(scannerParentElement);
   }    
 } 

}

Author:Pitiwat Rakprommarat,eproduced under the CC 4.0 BY-SA copyright license with a link to the original source and this disclaimer.
Link to original article:https://stackoverflow.com/questions/48395061/jsqrscanner-in-angular5-not-working
yy